<template>
  <div class="home-container">
   <AqHome v-if="childrenData.length > 0 && childrenData[1].path === '/home/aqHome'"/>
   <JdHome v-if="childrenData.length > 0 && childrenData[1].path === '/home/jdHome'" />
   <InMaintenanceListHome v-if="childrenData.length > 0 && childrenData[1].path === '/home/maintenance/list'"/>
  </div>
</template>
<script lang="ts" setup>
import AqHome from './aqHome.vue'
import JdHome from './jdHome.vue';
import InMaintenanceListHome from './maintenance/list.vue';
import { menuRouteApi } from '/@/api/sys/login';
import { ref, onMounted } from 'vue';

// 定义一个响应式变量来存储菜单数据
const menuData = ref([]);
// 定义一个响应式变量来存储 children 的值
const childrenData = ref([]);

const fetchMenuData = async () => {
 try {
   // 调用接口获取菜单数据
   const response = await menuRouteApi();
   menuData.value = response;
  //  console.log('菜单数据:', menuData.value[0]);
    // 检查 menuData.value[0] 是否存在且包含 children 属性
    if (menuData.value.length > 0 && menuData.value[0].children) {
     childrenData.value = menuData.value[0].children;
     console.log('children 的值:', childrenData.value);
   }
 } catch (error) {
   console.error('获取菜单数据失败:', error);
 }
};

// 在组件挂载时调用获取菜单数据的函数
onMounted(() => {
 fetchMenuData();
});
</script>

<style scoped lang="less">
.home-container {
 height: 100%;
 width: 100%;
}

</style>